<?php include $this->admin_tpl('header');?>
<style>
    .layui-tab-content{margin: 10px 80px 0 50px;}
    @media screen and (max-width: 590px) and (min-width: 100px) {
        .layui-tab-content{margin: 5px;}
    }
</style>
<body>
<form class="layui-form" action="javascript:;" onsubmit="return dosub(this)">
    <div class="mainBox">
        <div class="main-container">
            <div class="layui-tab layui-tab-brief" lay-filter="docDemoTabBrief">
                <ul class="layui-tab-title">
                    <li class="layui-this">常规</li>
                    <li>SEO</li>
                    <li>其他</li>
                </ul>
                <div class="layui-tab-content">
                    <div class="layui-tab-item layui-show">
                        <div class="layui-form-item">
                            <label class="layui-form-label required">所属栏目</label>
                            <div class="layui-input-block">
                                <select name="parent_id" lay-verify="required">
                                    <option value="" selected>请先选择栏目</option>
                                    <?php
                                    foreach($pid_list as $key=>$v){
                                    ?>
                                    <option value="<?php echo $v['id'] ?>"><?php echo $v['name'] ?></option>
                                    <?php } ?>
                                </select>
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <label class="layui-form-label required">标题</label>
                            <div class="layui-input-block">
                                <input type="text" name="title" lay-verify="required" autocomplete="off"
                                       placeholder="请输入标题" lay-reqtext="标题不能为空哦"
                                       class="layui-input" onblur="check_title()">
                                <div id="colorpicker" title="设置颜色"></div>
                                <input class="layui-input" type="hidden" name="title_color" id="title_color">
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <label class="layui-form-label">副标题</label>
                            <div class="layui-input-block">
                                <input type="text" name="subtitle" autocomplete="off" placeholder="请输入副标题"
                                       class="layui-input">
                            </div>
                        </div>
                        <div class="layui-form-item huicmf-upload">
                            <label class="layui-form-label">封面图</label>
                            <div class="layui-input-block">
                                <input type="text" name="image" value=""
                                       onmouseover="hui_img_preview('thumb-select-input',this.value)"
                                       onmouseout="layer.closeAll();" id="thumb-select-input" autocomplete="off"
                                       class="layui-input">
                                <button type="button" class="layui-btn layui-btn-normal webUpload" id="picker_pic"
                                        data-multiple="false" data-input-id="thumb-select-input"
                                        data-preview-id="image" data-type="image"><i class="layui-icon"></i>上传图片
                                </button>
                                <a class="layui-btn"
                                   data-open-pic="<?php echo U('admin/index/file_list',['type'=>'one','select_id'=>'thumb-select-input']) ?>">
                                    <i class="layui-icon">&#xe67c;</i>选择图片
                                </a>
                            </div>
                        </div>
                        <div class="layui-form-item" pane="">
                            <label class="layui-form-label">文档属性</label>
                            <div class="layui-input-block">
                                <?php foreach($flag_name as $key=>$v){
                                ?>
                                <input type="checkbox" name="flag[]" value="<?php echo $key; ?>" lay-skin="primary"
                                       title="<?php echo $v.'['.$key.']'; ?>" <?php if($key=4) echo "lay-filter='flag'"?>>
                                <?php } ?>
                            </div>
                        </div>
                        <div class="layui-form-item layui-hide" id="jumpUrl">
                            <label class="layui-form-label required">跳转url</label>
                            <div class="layui-input-block">
                                <input type="text" id="jump_url" name="jump_url" value="" autocomplete="off"
                                       class="layui-input"
                                       data-s='0'>
                            </div>
                            <tip>本站url可以直接使用“/”开头，其他url必须加“http|https”</tip>
                        </div>

                        <div class="layui-form-item">
                            <label class="layui-form-label">排序</label>
                            <div class="layui-input-inline">
                                <input type="number" id="weight" name="weight" value="0" autocomplete="off"
                                       class="layui-input">
                                <tip>越大排序越靠前</tip>
                            </div>
                        </div>

                        <div class="layui-form-item">
                            <label class="layui-form-label">内容</label>
                            <div class="layui-input-block" id="contentEditorHtml" style="z-index: 0">
                                <?php echo form::editor('content', $val='', 'width:100%;height:400px', false);?>
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <label class="layui-form-label"></label>
                            <div class="layui-input-block">
                                <input type="checkbox" name="auto_image" value="1" title="提取内容第一张图片为缩略图"
                                       lay-skin="primary">
                            </div>
                        </div>

                        <div class="layui-form-item">
                            <label class="layui-form-label">状态</label>
                            <div class="layui-input-block">
                                <input type="radio" name="status" value="1" title="发布" checked>
                                <input type="radio" name="status" value="2" title="未发布">
                            </div>
                        </div>

                    </div>
                    <div class="layui-tab-item">
                        <div class="layui-form-item">
                            <label class="layui-form-label">seo标题</label>
                            <div class="layui-input-block">
                                <input type="text" id="seotitle" name="seotitle" autocomplete="off"
                                       class="layui-input" placeholder="seo标题，为空则使用文章标题">
                            </div>
                            <tip>seo标题，为空则使用文章标题</tip>
                        </div>
                        <div class="layui-form-item">
                            <label class="layui-form-label">seo关键词</label>
                            <div class="layui-input-block">
                                <input type="text" id="keywords" name="keywords" autocomplete="off"
                                       class="layui-input" placeholder="多关键词之间用英文逗号“,”隔开">
                            </div>
                            <tip>多关键词之间用英文逗号“,”隔开</tip>
                        </div>
                        <div class="layui-form-item">
                            <label class="layui-form-label">描述</label>
                            <div class="layui-input-block">
                                <textarea name="description" autocomplete="off" class="layui-textarea"
                                          placeholder="如不填写，自动提取文章前250字符"></textarea>
                            </div>
                            <tip>如不填写，自动提取文章前250字符</tip>
                        </div>
                    </div>
                    <div class="layui-tab-item">
                        <div class="layui-form-item">
                            <label class="layui-form-label">来源</label>
                            <div class="layui-input-block">
                                <input type="text" id="source" name="source" autocomplete="off"
                                       class="layui-input" value="原创">
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <label class="layui-form-label">点击量</label>
                            <div class="layui-input-block">
                                <input type="text" id="click" name="click" autocomplete="off" value="0"
                                       class="layui-input" placeholder="">
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <label class="layui-form-label">作者昵称</label>
                            <div class="layui-input-block">
                                <input type="text" id="author" name="author" autocomplete="off" value="小编"
                                       class="layui-input" placeholder="">
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <label class="layui-form-label">发布时间</label>
                            <div class="layui-input-block">
                                <input type="text" id="publish_time" name="publish_time" autocomplete="off" value=""
                                       class="layui-input" placeholder="yyyy-MM-dd HH:mm:ss">
                            </div>
                        </div>
                    </div>
                </div>

            </div>

        </div>
    </div>
    <div class="bottom">
        <div class="button-container">
            <button type="submit" class="pear-btn pear-btn-primary pear-btn-sm" lay-submit=""
                    lay-filter="form-save">
                <i class="layui-icon layui-icon-ok"></i>
                提交
            </button>
            <button type="reset" class="pear-btn pear-btn-sm">
                <i class="layui-icon layui-icon-refresh"></i>
                重置
            </button>
        </div>
    </div>
</form>

<?php include $this->admin_tpl('footer');?>
<script>
  layui.use(['form', 'jquery', 'colorpicker', 'laydate'], function () {
    var form = layui.form;
    var $ = layui.jquery;
    var colorpicker = layui.colorpicker;
    var laydate = layui.laydate;
    //颜色选择器
    colorpicker.render({
      elem: '#colorpicker'  //绑定元素
      , color: ''
      , alpha: true //开启透明度
      , format: 'rgb'
      , predefine: true // 开启预定义颜色
      , done: function (color) {
        $('#title_color').val(color);
      }
    });
    //日期时间选择器
    laydate.render({
      elem: '#publish_time'
      , type: 'datetime'
    });

    form.on('checkbox(flag)', function (obj) {
      let check = obj.elem.checked;
      if (check) {
        $('#jumpUrl').removeClass('layui-hide');
        $("#jumpUrl>div>input").attr('data-s', '1');
      } else {
        $('#jumpUrl').addClass('layui-hide');
        $("#jumpUrl>div>input").attr('data-s', '0');
      }
    });

    window.dosub = function (obj) {
      let jump_url = $('#jump_url').val();
      let jumpCheck = $("#jumpUrl>div>input").attr('data-s');
      if (Number(jumpCheck) === 1 && jump_url.length < 1) {
        layer.msg('跳转url地址不能为空', {icon: 2});
        return false;
      }
      if (jump_url !== '') {
        let first_url_str = jump_url.charAt(0);
        if (first_url_str !== '/') {
          let strReg = "^((https|http|ftp|rtsp|mms)?://)";
          let re = new RegExp(strReg);
          if (!re.test(jump_url)) {
            layer.msg('不是有效的url地址', {icon: 2});
            return false;
          }
        }
      }
      $.ajax({
        url: "<?php echo U('admin/content/add'); ?>",
        data: $(obj).serialize(),
        dataType: 'json',
        contentType: 'application/json',
        type: 'post',
        success: function (res) {
          if (res.code === 200) {
            hui_msg(res.msg, 1, function () {
              window.location.reload();
            });
          } else {
            hui_msg(res.msg, 2);
          }
        }
      })
      return false;
    }

    window.check_title = function () {
      var title = $("[name=title]").val();
      var keywords = $("[name=keywords]").val();
      if (keywords.length < 1) {
        $.ajax({
          type: "POST",
          url: "<?php echo U('admin/content/public_pullword');?>",
          data: {content: title},
          dataType: "json",
          success: function (res) {
            if (res.code == 200 && res.data) {
              $("[name=keywords]").val(res.data);
            }
          }
        })
      }
    }
  })
</script>
<script>
</script>
</body>
</html>
